import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_ui_demo/res/button_styles.dart';

class ButtonPage extends StatefulWidget {
  ButtonPage({Key? key}) : super(key: key);

  @override
  _ButtonPageState createState() => _ButtonPageState();
}

class _ButtonPageState extends State<ButtonPage> {
  /// DropdownButton选中值
  String? _selectValue;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Button"),
        centerTitle: true,
        elevation: 0.5,
      ),
      body: SafeArea(
        child: SingleChildScrollView(
          child: Align(
            alignment: Alignment.center,
            child: Column(
              children: <Widget>[
                MaterialButton(
                  child: Text("MaterialButton"),
                  onPressed: () {},
                ),
                SizedBox(height: 10.0),
                CupertinoButton(
                  child: Text("CupertinoButton"),
                  onPressed: () {},
                ),
                SizedBox(height: 10.0),
                ElevatedButton(
                  style: raisedButtonStyle,
                  child: Text("RaisedButton"),
                  onPressed: () {},
                ),
                SizedBox(height: 10.0),
                TextButton(
                  style: flatButtonStyle,
                  child: Text("FlatButton"),
                  onPressed: () {},
                ),
                SizedBox(height: 10.0),
                OutlinedButton(
                  style: outlineButtonStyle,
                  child: Text("OutlineButton"),
                  onPressed: () {},
                ),
                SizedBox(height: 10.0),
                FloatingActionButton(
                  child: Icon(Icons.android),
                  onPressed: () {},
                ),
                SizedBox(height: 10.0),
                IconButton(
                  icon: Icon(Icons.thumb_up),
                  onPressed: () {},
                ),
                SizedBox(height: 10.0),
                DropdownButton(
                  value: _selectValue,
                  items: [
                    DropdownMenuItem(
                      child: new Text('one'),
                      value: '1',
                    ),
                    DropdownMenuItem(
                      child: new Text('two'),
                      value: '2',
                    ),
                    DropdownMenuItem(
                      child: new Text('three'),
                      value: '3',
                    ),
                  ],
                  hint: new Text('DropdownButton'),
                  onChanged: (value) {
                    setState(() {
                      _selectValue = value as String;
                    });
                  },
                ),
                PopupMenuButton(
                  // child: Text("PopupMenuButton"),
                  // icon: Text("PopupMenuButton"),
                  itemBuilder: (BuildContext context) {
                    return <PopupMenuItem<String>>[
                      PopupMenuItem<String>(
                        child: Text("热度"),
                        value: "hot",
                      ),
                      PopupMenuItem<String>(
                        child: Text("最新"),
                        value: "new",
                      ),
                    ];
                  },
                ),
                ButtonBar(
                  mainAxisSize: MainAxisSize.min,
                  children: <Widget>[
                    Text("ButtonBar"),
                    Text("ButtonBar"),
                  ],
                ),
                ToggleButtons(
                  color: Colors.black.withOpacity(0.60),
                  selectedColor: Color(0xFF6200EE),
                  selectedBorderColor: Color(0xFF6200EE),
                  fillColor: Color(0xFF6200EE).withOpacity(0.08),
                  splashColor: Color(0xFF6200EE).withOpacity(0.12),
                  hoverColor: Color(0xFF6200EE).withOpacity(0.04),
                  borderRadius: BorderRadius.circular(4.0),
                  constraints: BoxConstraints(minHeight: 36.0),
                  isSelected: [true, false, false],
                  onPressed: (index) {},
                  children: [
                    Padding(
                      padding: EdgeInsets.symmetric(horizontal: 16.0),
                      child: Text('BUTTON 1'),
                    ),
                    Padding(
                      padding: EdgeInsets.symmetric(horizontal: 16.0),
                      child: Text('BUTTON 2'),
                    ),
                    Padding(
                      padding: EdgeInsets.symmetric(horizontal: 16.0),
                      child: Text('BUTTON 3'),
                    ),
                  ],
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}
